<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>AUI快速完成布局</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />

</head>
<body>
  <footer class="aui-bar aui-bar-tab" id="footer">
  <div class="aui-bar-tab-item  footer-tab" tapmode data-name="main" data-url="../index_one.html" >
      <i class="aui-iconfont aui-icon-home"></i>
      <div class="aui-bar-tab-label">首页</div>
  </div>
  <div class="aui-bar-tab-item footer-tab " tapmode  data-name="task_center" data-url="task_center.html">
      <i class="aui-iconfont aui-icon-star"></i>
      <div class="aui-bar-tab-label">任务中心</div>
  </div>
  <div class="aui-bar-tab-item footer-tab aui-active" tapmode  data-name="member_friend" data-url="member_friend.html">
      <div class="aui-badge">99</div>
      <i class="aui-iconfont aui-icon-cart"></i>
      <div class="aui-bar-tab-label">邀请有奖</div>
  </div>
  <div class="aui-bar-tab-item footer-tab" tapmode  data-name="task_ing" data-url="task_ing.html">
      <i class="aui-iconfont aui-icon-home"></i>
      <div class="aui-bar-tab-label">任务进展</div>
  </div>
  <div class="aui-bar-tab-item footer-tab" tapmode data-name="login" data-url="login.html">
      <div class="aui-dot"></div>
      <i class="aui-iconfont aui-icon-my"></i>
      <div class="aui-bar-tab-label">我的</div>
  </div>
  </footer>
</body>
<script type="text/javascript" src="./script/api.js" ></script>
<script type="text/javascript" src="../script/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
apiready = function() {

        $("#footer .footer-tab").each(function(){
       	    $(this).click(function(){
       		    var name=$(this).attr("data-name");
                var url=$(this).attr("data-url");
              api.openWin({
            		        name: name,
            	          url: url,
                        opaque: true,
          			        vScrollBarEnabled:false

            	   });
               });
          });

}
</script>
</html>
